@import './variables.less';

// global common
.app-main {
    min-height: 100%;
}

.app-container {
    background-color: @white-bg;
    overflow: hidden;
}

body {
    padding: 0;
    margin: 0;
    height: 100%; // https://www.zhangxinxu.com/wordpress/2017/02/font-kerning-font-smoothing-font-variant/
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-family: AlibabaPuHuiTi-Medium;
    // color: #333;
}

label {
    font-weight: 500;
}

html {
    height: 100%;
    box-sizing: border-box;
}



*,
*:before,
*:after {
    box-sizing: inherit;
}

a,
a:focus,
a:hover {
    cursor: pointer;
    color: inherit;
    outline: none;
    text-decoration: none;
}

div:focus {
    outline: none;
}

a:focus,
a:active {
    outline: none;
}

a,
a:focus,
a:hover {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
}

.clearfix {
    &:after {
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
    }
}

.flex-row {
    display: flex;
    flex-direction: row;
}

.flex-column {
    display: flex;
    flex-direction: column;
}

.flex-center-start {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.flex-center, .flex-center-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-center-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.flex-start, .flex-start-start {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.flex-start-center {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.flex-start-end {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.flex-end-start {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.flex-end-center {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.flex-end, .flex-end-end {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}
